<template>
    <div>
        <div>
            <div @click="goMy" id="goMy">退出</div>
        </div>
        <el-table
                :data="tuiList"
                border
                style="width: 100%"
                :header-cell-style="getRowClass">
            <el-table-column
                    prop="id"
                    label="编号"
            >
            </el-table-column>
            <el-table-column
                    prop="usermonicker"
                    label="用户昵称"
            >
            </el-table-column>
            <el-table-column
                    prop="ordersid"
                    label="订单编号"
            >
            </el-table-column>
            <el-table-column
                    prop="dishName"
                    label="菜品名称"
            >
            </el-table-column>
            <el-table-column
                    prop="tuiTime"
                    label="退款时间"
            >
            </el-table-column>
            <el-table-column
                    prop="status"
                    label="审核状态"
            >
                <template slot-scope="scope">
                    <el-button type="success" v-if="scope.row.status==1" size="medium">审核通过</el-button>
                    <el-button type="warning"  v-if="scope.row.status==0" size="medium">待审核</el-button>
                    <el-button type="danger"  v-if="scope.row.status==2" size="medium">审核驳回</el-button>
                </template>
            </el-table-column>
            <el-table-column
                    prop="refuseReason"
                    label="退款拒绝理由"
            >
            </el-table-column>
            <el-table-column
                    prop="alipayNo"
                    label="支付宝流水号"
            >
            </el-table-column>
            <el-table-column
                    prop="dishTotalPrice"
                    label="退款金额"
            >
            </el-table-column>
        </el-table>
    </div>
</template>

<script>
    export default {
        name: "Refund",
        data(){
            return{
                tuiList:[],
            }
        },
        created() {
            this.selectALl();
        },
        methods:{
            // 退出
            goMy(){
                this.$router.push("/index/my");
            },
            // 表头样式
            getRowClass() {
                return "background:#4841C1; color:#fff;";
            },
            // 查询当前用户所有的退款记录
            selectALl() {
                var token = sessionStorage.getItem("token");
                this.$http.post("/collect/collect/tuimoney?token="+token).then(result => {
                    console.log(result)
                    this.tuiList = result.data.data;
                })
            },
        }
    }
</script>

<style scoped>
    #goMy{

        margin-top: 5%;
        margin-block: 5%;
        padding-left: 5%;
        font-size: 20px;
        font-family: 楷书;
        font-weight: bold;
        color: blue;

    }
</style>